<template>
	<div class="mindFrame" v-if="show">
    <p class="closeBtn" @click="doClose">
      <i class="iconfont iconclose-hei"></i>
    </p>
    <iframe :src="src" :title="title" width="100%" height="100%" style="border: none;">
      <p>Your browser does not support iframes.</p>
    </iframe>
	</div>
</template>

<script>
export default {
  name: 'mindFrame',
	props: {
    src: String,
    title: String,
    show: {
      type: Boolean,
      default: false,
    },
    closeEvent: {
      type: Function,
      default: () => {}
    }
  },
  data () {
    return {
			msg: 'hello mindFrame!'
		}
  },
	methods: {
    doClose() {
      this.closeEvent(false)
    }
  },
  destroyed() {
  }
}
</script>
<style scoped>
.mindFrame {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.4);
}
.closeBtn {
  position: absolute;
  color: #fff;
  padding: 15px;
  cursor: pointer;
}
</style>
